import { reactive, toRefs } from 'vue'
import { onPageScroll } from '@dcloudio/uni-app'
export default function useNavBar() {
  const options = reactive({
    top: 0, //标题图标距离顶部距离
    opacity: 0,
    scrollTop: 0.5,
    height: 0,
    // 手机顶部状态栏的高度
    // statusBarHeight: 0
    // 屏幕宽度
    width: 375
  })

  function initNavigation(e) {
    options.height = e.height
    options.opacity = e.opacity
    options.top = e.top
    options.width = e.width
    console.log(e);
    
  }

  function opacityChange(e) {
    options.opacity = e.opacity
  }

  function back() {
    uni.navigateBack()
  }

  onPageScroll((e) => {
    options.scrollTop = e.scrollTop
  })

  return {
    ...toRefs(options),
    initNavigation,
    opacityChange,
    back,
  }
}
